<!DOCTYPE html>
<html>

<head>
  <title>表单设计器kcz</title>
  <meta charset="UTF-8">
  <link rel="stylesheet" href="http://unpkg.com/k-form-design/lib/k-form-design.css">
</head>

<body>
  <div class="app">
    <k-form-build ref="KFB" @submit="handleSubmit" :value="jsonData"></k-form-build>
    <button @click="getData">提交</button>
  </div>
  <script src="http://cdn.kcz66.com/vue.min.js"></script>
  <script src="http://unpkg.com/k-form-design/lib/k-form-design.umd.min.js"></script>
  <script>
    let jsonData = {"list":[{"type":"rate","label":"商品质量","options":{"defaultValue":0,"max":5,"disabled":false,"showLabel":true,"hidden":false,"allowHalf":false},"help":"","rules":[{"required":false,"message":"必填项"}],"key":"rate_1703514354272","model":"project"},{"type":"rate","label":"客服态度","icon":"icon-pingfen_moren","options":{"defaultValue":0,"max":5,"disabled":false,"showLabel":true,"hidden":false,"allowHalf":false},"help":"","rules":[{"required":false,"message":"必填项"}],"key":"rate_1703514359251","model":"kftd"},{"type":"rate","label":"物流速度","options":{"defaultValue":0,"max":5,"disabled":false,"showLabel":true,"hidden":false,"allowHalf":false},"help":"","rules":[{"required":false,"message":"必填项"}],"key":"rate_1703514248919","model":"wlsd"},{"type":"textarea","label":"商品评价","options":{"width":"100%","minRows":4,"maxRows":6,"maxLength":null,"defaultValue":"","clearable":false,"showLabel":true,"hidden":false,"disabled":false,"placeholder":"请输入"},"help":"","rules":[{"required":false,"message":"必填项"}],"key":"textarea_1703514239888","model":"sppj"},{"type":"switch","label":"匿名","icon":"icon-kaiguan3","options":{"defaultValue":false,"showLabel":true,"hidden":false,"disabled":false},"help":"","rules":[{"required":false,"message":"必填项"}],"key":"switch_1703514362333","model":"switch"}],"config":{"layout":"horizontal","labelCol":{"xs":4,"sm":4,"md":4,"lg":4,"xl":4,"xxl":4},"labelWidth":100,"labelLayout":"flex","wrapperCol":{"xs":18,"sm":18,"md":18,"lg":18,"xl":18,"xxl":18},"hideRequiredMark":false,"customStyle":""}}
    let vm = new Vue({
      el: '.app',
      data: {
        jsonData
      },
      methods: {
        handleSubmit(p) {
          // 通过表单提交按钮触发，获取promise对象
          p().then(res => {
            // 获取数据成功
            //alert(JSON.stringify(res))
            window.location.href = 'http://127.0.0.1:8000/beifan/result'
          })
            .catch(err => {
              console.log(err, '校验失败')
            })
        },
        getData() {
          // 通过函数获取数据
          this.$refs.KFB.getData().then(res => {
            // 获取数据成功
            alert(JSON.stringify(res))
          })
            .catch(err => {
              console.log(err, '校验失败')
            })
        }
      }
    })
  </script>
</body>

</html>